* {
  margin: 0;
  box-sizing: border-box;
}

body {
  font-family: PingFang SC, 'Helvetica Neue', Arial, sans-serif;
}

// Color Palette
@black: #000;
@white: #fff;
@gray-1: #f7f8fa;
@gray-2: #f2f3f5;
@gray-3: #ebedf0;
@gray-4: #dcdee0;
@gray-5: #c8c9cc;
@gray-6: #969799;
@gray-7: #646566;
@gray-8: #323233;
@red: #ee0a24;
@blue: #1989fa;
@orange: #ff976a;
@orange-dark: #ed6a0c;
@orange-light: #fffbe8;
@green: #07c160;

// Gradient Colors
@gradient-red: linear-gradient(to right, #ff6034, #ee0a24);
@gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);

// Component Colors
@text-color: @gray-8;
@active-color: @gray-2;
@active-opacity: .7;
@disabled-opacity: .5;
@background-color: @gray-1;
@background-color-light: #fafafa;

// Padding
@padding-base: 4px;
@padding-xs: @padding-base * 2;
@padding-sm: @padding-base * 3;
@padding-md: @padding-base * 4;
@padding-lg: @padding-base * 6;
@padding-xl: @padding-base * 8;

// Font
@font-size-xs: 20px;
@font-size-sm: 24px;
@font-size-md: 28px;
@font-size-lg: 32px;
@font-weight-bold: 500;
@price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;

// Animation
@animation-duration-base: .3s;
@animation-duration-fast: .2s;

// Border
@border-color: @gray-3;
@border-width-base: 1px;
@border-radius-sm: 2px;
@border-radius-md: 4px;
@border-radius-lg: 8px;
@border-radius-max: 999px;
// Button
@button-mini-height: 44px;
@button-mini-min-width: 100px;
@button-mini-line-height: 40px;
@button-small-height: 60px;
@button-small-min-width: 120px;
@button-small-line-height: 56px;
@button-large-height: 100px;
@button-large-line-height: 92px;
@button-default-height: 88px;
@button-default-line-height: 84px;

// Switch
.van-switch__node {
  top: 1px;
}

.van-switch {
  height: 1.1em;
  border-color: #c5cee1;
}

.van-switch.van-switch--on {
  border-color: #ff6034;
}

.van-switch--on .van-switch__node {
  transform: translateX(1.14em);
}

@switch-size: 30px;
@switch-width: 2.2em;
@switch-top: .01rem;
@switch-height: 1.2em;
@switch-node-size: 1em;

// NavBar
.van-nav-bar {

  // background:linear-gradient(90deg,rgba(145,126,255,1) 0%,rgba(145,126,255,1) 100%);
  .van-nav-bar__title {
    font-size: 34px;
    font-weight: 400;
    margin: 0 auto;
  }

  .van-icon {
    color: #fff;
  }
}

.nav-bar {
  height: 92px;
}

.van-nav-bar.bg_white,
.van-nav-bar.bg_grey {
  .van-nav-bar__title {
    color: #353535
  }

  &::after {
    display: none;
  }

  .van-icon {
    color: #353535;
  }
}

.van-nav-bar.bg_grey {
  background: #F5F5F4;

  .van-nav-bar__text {
    color: #666;
    font-size: 28px;
  }
}

.van-nav-bar.bg_white {
  background: #fff;
}

.van-nav-bar.bg_transparent {
  background: transparent;

  &::after {
    display: none;
  }
}

.van-nav-bar__right .van-nav-bar__text {
  font-size: 24px;
  margin-right: 10px;
}

.van-nav-bar__text:active {
  background-color: transparent;
}

.van-sticky--fixed {
  .van-hairline-j--bottom::after {
    display: none;
  }
}

@nav-bar-height: 92px;
// @nav-bar-background-color: @white;
@nav-bar-arrow-size: 42px;
@nav-bar-icon-color: @white;
;
@nav-bar-text-color: @white;
;
@nav-bar-title-text-color: @white;

// Field
@field-label-width: 140px;
@field-input-text-color: @text-color;
@field-input-error-text-color: @red;
@field-input-disabled-text-color: @gray-6;
@field-placeholder-text-color: @gray-6;
@field-icon-size: 32px;
@field-clear-icon-size: 32px;
@field-clear-icon-color: @gray-5;
@field-right-icon-color: @gray-6;
@field-error-message-color: @red;
@field-error-message-text-color: 24px;
@field-text-area-min-height: 120px;
@field-word-limit-color: @gray-7;
@field-word-limit-font-size: @font-size-sm;
@field-word-limit-line-height: 32px;

// Cell
.van-cell:not(:last-child)::after {
  left: 0;
  border-bottom: 1px solid #ebedf0;
  /*no*/
}

.van-cell {
  padding: 30px 40px;
}

.login-box,
.register {
  .van-cell {
    background-color: transparent;
    padding: 0;
    margin-top: 30px;
    border-bottom: 1px solid #FF7798;

    /*no*/
    .van-field__control {
      color: #fff;
      padding: 29px 0;
      font-size: 36px;
    }

    .van-field__control:focus+.van-field__body {
      border-color: #fff;
    }

    &::after {
      display: none;
    }

    .van-field__clear {
      color: #fff;
      padding: 12px;
    }

    .van-field__control::placeholder {
      color: #FF84A2 !important;
    }
  }

  .logo {
    width: 201px;
    height: 201px;
    border-radius: 201px;
    margin: 0 auto;
  }

  .hd {
    padding: 20px 0 80px 0;

    .close {
      width: 40px;
      height: 37px;
      margin: 20px 0 0 50px;
      display: block;
      background-image: url('/static/img/icon-arrow-left.svg');
      background-position: center center;
      fill: #fff;
      background-repeat: no-repeat;
      background-size: 40px 37px;
    }
  }

  .van-cell.focus {
    border-color: #fff;
  }
}

@cell-font-size: @font-size-md;
@cell-line-height: 42px;
@cell-vertical-padding: 20px;
@cell-horizontal-padding: @padding-md;
@cell-text-color: @text-color;
@cell-background-color: @white;
@cell-border-color: @border-color;
@cell-active-color: @active-color;
@cell-required-color: @red;
@cell-label-color: @gray-6;
@cell-label-font-size: @font-size-sm;
@cell-label-line-height: 36px;
@cell-label-margin-top: 6px;
@cell-value-color: @gray-6;
@cell-icon-size: 32px;
@cell-right-icon-color: @gray-6;
@cell-large-vertical-padding: @padding-sm;
@cell-large-title-font-size: @font-size-lg;
@cell-large-label-font-size: @font-size-md;

// DropdownMenu
@dropdown-menu-height: 80px;
@dropdown-menu-background-color: @white;
@dropdown-menu-title-font-size: 30px;
@dropdown-menu-title-text-color: @text-color;
@dropdown-menu-title-active-text-color: @blue;
@dropdown-menu-title-disabled-text-color: @gray-6;
@dropdown-menu-title-padding: 0 @padding-xs;
@dropdown-menu-title-line-height: 36x;
@dropdown-menu-option-active-color: @blue;
@dropdown-menu-content-max-height: 80%;
@dropdown-item-z-index: 10;

.van-dropdown-menu__title::after {
  border-width: 6px;
  right: -18px;
  margin-top: -10px;
  // top:-5px;
}

.van-dropdown-menu__title--down::after {
  border-width: 6px;
  right: -18px;
  margin-top: -3px;
}

// CellGroup
@cell-group-background-color: @white;
@cell-group-title-color: @gray-6;
@cell-group-title-padding: @padding-md @padding-md @padding-xs;
@cell-group-title-font-size: @font-size-md;
@cell-group-title-line-height: 32px;

.operation {
  .van-checkbox__icon--checked .van-icon {
    color: #917EFF;
    background-color: #fff;
    border-color: #fff;
    border-radius: 4px;
  }

  .van-checkbox__icon {
    border-radius: 4px;
  }

  .van-checkbox__label {
    color: #fff;
  }
}

// Checkbox
@checkbox-size: 30px;
@checkbox-border-color: @gray-5;
@checkbox-transition-duration: @animation-duration-fast;
@checkbox-label-margin: @padding-xs;
@checkbox-label-color: @text-color;
@checkbox-checked-icon-color: @blue;
@checkbox-disabled-icon-color: @gray-5;
@checkbox-disabled-label-color: @gray-5;
@checkbox-disabled-background-color: @border-color;

// PullRefresh
@pull-refresh-head-height: 80px;
@pull-refresh-head-font-size: @font-size-md;
@pull-refresh-head-text-color: @gray-6;

.van-pull-refresh,
.van-pull-refresh .van-pull-refresh__track {
  min-height: 100%;
}

// Loading
@loading-text-color: @gray-6;
@loading-text-font-size: @font-size-md;
@loading-spinner-color: @gray-5;
@loading-spinner-size: 60px;
@loading-spinner-animation-duration: 0.8s;

.van-empty__description {
  font-size: 26px;
}

// Picker
@picker-toolbar-height: 88px;

// Toast
@toast-max-width: 70%;
@toast-font-size: @font-size-md;
@toast-text-color: @white;
@toast-loading-icon-color: @white;
@toast-line-height: 60px;
@toast-border-radius: @border-radius-md;
@toast-background-color: fade(@text-color, 88%);
@toast-icon-size: 100px;
@toast-text-min-width: 142px;
@toast-text-padding: 6px 26px;
;
@toast-default-padding: @padding-md;
@toast-default-width: 140px;
@toast-default-min-height: 140px;
@toast-position-top-distance: 100px;
@toast-position-bottom-distance: 100px;

.van-empty {
  padding-top: 100px;

  .van-empty__image {
    width: 220px;
    height: 220px;
  }
}

// Dialog
.van-dialog__header {
  font-weight: 400;
}

.van-dialog .van-dialog__cancel {
  color: #999;
}

@dialog-width: 640px;
@dialog-small-screen-width: 90%;
@dialog-font-size: @font-size-lg;
@dialog-transition: @animation-duration-base;
@dialog-border-radius: 32px;
@dialog-background-color: @white;
@dialog-header-font-weight: @font-weight-bold;
@dialog-header-line-height: 48px;
@dialog-header-padding-top: 30px;
@dialog-header-isolated-padding: 50px 0;
@dialog-message-padding: 50px;
@dialog-message-font-size: 34px;
@dialog-message-line-height: 40px;
@dialog-message-max-height: 60vh;
@dialog-has-title-message-text-color: @gray-7;
@dialog-has-title-message-padding-top: 40px;
;
@dialog-confirm-button-text-color: #ff0034;

.cell-group {
  padding: 0 25px;
  margin: 20px;
  border-radius: 10px;
  background-color: #fff;

  .cell {
    display: flex;
    justify-content: space-between;
  }

  .cell,
  .cells {
    padding: 38px 0 36px;

    .title {
      color: #252525;
      font-size: 30px;
      display: flex;
      align-items: center;

      .name {
        padding-left: 10px;
      }

      .icon {
        display: inline-block;
        width: 70px;
        height: 70px;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 70px 70px;
        margin-right: 10px;
      }

      .icon-coupons {
        background-image: url('/static/img/icon-coupons.png');
      }

      .icon-adderss {
        background-image: url('/static/img/icon-adderss.png');
      }

      .icon-switch {
        background-image: url('/static/img/icon-switch.png');
      }

      .icon-collection {
        background-image: url('/static/img/icon-collection.png');
      }

      .icon-tenants {
        background-image: url('/static/img/icon-tenants.png');
      }
    }

    .value {
      color: #555;
      font-size: 24px;
      margin-right: 5px;
      display: flex;
      align-items: center;

      .text {
        display: inline-block;
        line-height: 24px;
      }
    }

    .value.isArrow {
      &::after {
        content: '';
        display: inline-block;
        width: 14px;
        height: 24px;
        background-image: url('/static/images/icon-arrow-right.png');
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 14px 24px;
        vertical-align: middle;
        margin-left: 32px;
      }
    }
  }
}

// Notify
@notify-padding: 22px 0;
@notify-font-size: @font-size-md;
@notify-line-height: 40px;
@notify-primary-background-color: @blue;
@notify-success-background-color: @green;
@notify-danger-background-color: @red;
@notify-warning-background-color: @orange;

// NumberKeyboard
@number-keyboard-background-color: @white;
@number-keyboard-key-height: 108px;
@number-keyboard-key-background: @gray-3;
@number-keyboard-key-font-size: 48px;
@number-keyboard-key-active-color: @active-color;
@number-keyboard-delete-font-size: @font-size-lg;
@number-keyboard-title-color: @gray-7;
@number-keyboard-title-height: 60px;
@number-keyboard-title-font-size: @font-size-md;
@number-keyboard-close-padding: 0 @padding-md;
@number-keyboard-close-color: @blue;
@number-keyboard-close-font-size: @font-size-md;
@number-keyboard-button-text-color: @white;
@number-keyboard-button-background-color: @blue;
@number-keyboard-cursor-color: @text-color;
@number-keyboard-cursor-width: 1px;
@number-keyboard-cursor-height: 40%;
@number-keyboard-cursor-animation-duration: 1s;


.info-box {
  display: flex;

  .images {
    width: 100%;
    overflow-x: scroll;
    white-space: nowrap;

    /*不换行*/
    .img {
      display: inline-block;
      margin-right: 10px;
    }
  }

  .img {
    width: 160px;
    height: 160px;
    border-radius: 10px;
    background-color: #eee;
  }

  .info {
    flex: 1;
    padding: 15px 60px 5px 20px;
    display: flex;
    align-items: center;

    .name {
      width: 100%;
      font-size: 28px;
      height: 80px;
      color: #353535;
    }
  }

  .slot {
    display: flex;
    padding-left: 20px;
    justify-content: flex-end;
    align-items: center;
    font-size: 24px;

    .m-num {
      display: block;
      text-align: right;
      white-space: nowrap;

      .num {
        display: block;
        color: #959595;
        font-size: 24px;
      }
    }

    .m-price {
      font-size: 34px;

      &::after {
        font-size: 24px;
      }
    }
  }
}

.order-list {
  padding: 20px 20px 8px;
  margin: 0 20px;
  border-radius: 15px;
  margin-top: 20px;
  background-color: #fff;

  .title {
    display: flex;
    justify-content: space-between;
    font-size: 28px;
    padding: 15px 0;

    .number {
      color: #555;
    }

    .state {
      color: #FF0000
    }
  }

  .info-box {
    margin: 10px 0;
  }
}

// SidebarItem
@sidebar-font-size: @font-size-md;
@sidebar-line-height: 80px;
@sidebar-text-color: @text-color;
@sidebar-disabled-text-color: @gray-5;
@sidebar-padding: 20px @padding-sm 20px @padding-xs;
@sidebar-active-color: @active-color;
@sidebar-background-color: @background-color-light;
@sidebar-selected-font-weight: @font-weight-bold;
@sidebar-selected-text-color: @text-color;
@sidebar-selected-border-color: @red;
@sidebar-selected-background-color: #F3F3F3;

.classType {
  background-color: #fff;
  margin: 0 0 20px 0;
  border-radius: 15px;
  flex: 1;
  padding: 20px;
  overflow-y: auto;
  overflow-x: hidden;

  .list {
    .rows {
      width: 33.33%;
      float: left;

      .r-wp {
        width: 155px;
        margin: 0 auto;
      }

      .row-img {
        width: 155px;
        height: 155px;
        object-fit: contain;
        background-color: #eee;

        img {
          width: 155px;
          height: auto;
        }
      }

      .name {
        text-align: center;
        font-size: 24px;
        padding: 15px 0;
        color: #353535;
      }
    }
  }
}

/*通用筛选*/
.nav-bar-srot {
  display: flex;
  border-bottom: 1px solid rgba(238, 238, 238, 0.6);

  /*no*/
  .tab {
    flex: 1;
    display: block;
    text-align: center;
    padding: 30px 0;
    font-size: 30px;
    color: #353535;

    .sort {
      position: relative;

      &::after {
        content: '';
        display: block;
        width: 15px;
        position: absolute;
        top: 8px;
        right: -26px;
        height: 28px;
        background-image: url('/static/images/icon-sort.png');
        background-repeat: no-repeat;
        background-size: cover;
      }
    }

    .sort.asc {
      &::after {
        background-image: url('/static/images/icon-sort-asc.png');
        transform: rotate(180deg);
      }
    }

    .sort.desc {
      &::after {
        background-image: url('/static/images/icon-sort-asc.png');
      }
    }
  }

  .tab.active {
    color: #ff0034;
  }

  .tab.price {}
}

.nav-bar-srot.store-srot {
  border-top: 1px solid #eee;

  /*no*/
  .tab {
    padding: 17px 0;
  }
}

.van-toast--text,
.van-toast--html {
  min-width: auto;
}

.van-skeleton__avatar--round {
  border-radius: 0;
}

/*通用产品列表*/
.product-list {
  margin-top: 20px;
  background-color: #fff;
  // box-shadow: 0px 10px 15px 0px rgba(221, 221, 221, 0.3);
  border-radius: 10px;
  padding: 25px;

  .pro-title {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .name {
      font-size: 34px;
    }

    .more {
      color: #666;
      font-size: 28px;
    }
  }

  .pro-ad {
    border-radius: 10px;
    background-color: #eee;
    // height: 150px;
    margin: 30px 0 06px;

    img {
      width: 100%;
      height: 100%;
    }
  }

  .pro-item-wp {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;

    .van-skeleton {
      padding: 15px 0;
    }

    .pro-item {
      width: 314px;
      margin-top: 14px;

      .image {
        width: 314px;
        height: 314px;
        border-radius: 10px;
        background-color: #eee;

        .van-skeleton {
          padding: 0;
        }
      }

      .title {
        font-size: 28px;
        color: #353535;
        overflow: hidden;
        margin: 10px 0 14px;
      }

      .coupon {
        color: #ff0034;
        font-size: 24px;
        border-radius: 8px;
        font-weight: 500;
        display: inline-block;
        border: 1px solid #ff0034;
        /*no*/
        padding: 4px 10px;
        margin-bottom: 10px;
      }

      .price {
        font-size: 36px;
        color: #ff0034;
        font-weight: 800;
      }
    }
  }
}

.van-skeleton {
  padding: 0;
}

.store-list {
  background-color: transparent;
  margin-top: 0;
  padding-top: 0;

  .pro-item-wp {
    .pro-item {
      background-color: #fff;
      border-radius: 10px;
      margin-top: 25px;
      width: 340px;

      .image {
        width: 340px;
        height: 340px;
        border-radius: 0;
      }

      .pro-item-info-wp {
        padding: 5px 20px 10px;
      }
    }
  }
}

/*通用搜索*/
.mall-search {
  background-color: #fff;
  display: flex;

  .van-icon {
    font-size: 42px;
    width: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .search {
    flex: 1;
    padding: 20px 49px 26px 0;

    .input {
      padding: 15px 20px 10px;
      width: 100%;
      border-radius: 56px;
      background-color: #f1f3f7;

      .icon-search,
      .icon-search-white {
        width: 31px;
        height: 32px;
        background-repeat: no-repeat;
        display: inline-block;
        background-size: contain;
        margin-right: 16px;
        position: relative;
        top: 4px;
        background-position: center center;
      }

      .icon-search-white {
        background-image: url('/static/img/icon-search-white.png');
      }

      .icon-search {
        background-image: url('/static/img/icon-search.png');
      }

      .icon-search.none {
        margin: 0;
      }
    }
  }
}

.mall-search.bg_grey {
  background-color: #F1F3F7;

  .input {
    background-color: #fff;
  }
}

.mall-search.bg_none {
  background-color: transparent;

  .input {
    background-color: rgba(0, 0, 0, 0.3);

    .van-field__control {
      color: #fff;
    }

    .van-field__control::placeholder {
      color: #fff;
      font-weight: 400;
    }

  }
}

.van-stepper {
  .van-stepper__minus {
    // border:1px solid #bbb; /*no*/
    background-color: #fff;
    background-image: url('/static/img/icon-stepper__minus.png');
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: center center;
  }

  .van-stepper__minus::before,
  .van-stepper__plus::before,
  .van-stepper__minus::after,
  .van-stepper__plus::after {
    // background-color: #555;
    display: none;
  }

  .van-stepper__input {
    // border:1px solid #bbb; /*no*/
    background-color: #eee;
    margin: 0 -2px;
  }

  .van-stepper__plus {
    // border:1px solid #bbb; /*no*/
    background-color: #fff;
    background-image: url('/static/img/icon-stepper__plus.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-size: 30px 30px;
    background-position: center center;
  }
}

.stepper {
  .van-stepper__minus {
    border: 1px solid #eee;
    /*no*/
    background-color: #fff;
  }

  .van-stepper__input {
    border: 1px solid #eee;
    /*no*/
    background-color: #fff;
    border-left: 0;
    border-right: 0;
  }

  .van-stepper__plus {
    border: 1px solid #eee;
    /*no*/
    background-color: #fff;
  }
}

// Stepper
@stepper-active-color: #e8e8e8;
@stepper-background-color: @active-color;
@stepper-button-icon-color: @text-color;
@stepper-button-disabled-color: @background-color;
@stepper-button-disabled-icon-color: @gray-5;
@stepper-input-width: 64px;
@stepper-input-height: 60px;
@stepper-input-font-size: @font-size-md;
@stepper-input-text-color: @text-color;
@stepper-input-disabled-text-color: @gray-5;
@stepper-input-disabled-background-color: @active-color;
@stepper-border-radius: @border-radius-md;

// List
@list-icon-margin-right: 5px;
@list-text-color: @gray-6;
@list-text-font-size: @font-size-md;
@list-text-line-height: 90px;

.nodata {
  height: 100%;
  min-height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28px;
  color: #666;
}

// Picker

@picker-background-color: @white;
@picker-toolbar-height: 88px;
@picker-title-font-size: @font-size-lg;
@picker-action-padding: 0 @padding-md;
@picker-action-font-size: @font-size-md;
@picker-action-text-color: @blue;
@picker-action-active-color: @active-color;
@picker-option-font-size: @font-size-lg;
@picker-option-text-color: @black;
@picker-option-disabled-opacity: 0.3;
@picker-loading-icon-color: @blue;
@picker-loading-mask-color: rgba(255, 255, 255, 0.9);

// Popup
@popup-background-color: @white;
@popup-transition: transform @animation-duration-base;
@popup-round-border-radius: 30px;
@popup-close-icon-size: 44px;
@popup-close-icon-color: @gray-5;
@popup-close-icon-active-color: @gray-6;
@popup-close-icon-margin: 16px;
@popup-close-icon-z-index: 1;

.van-nav-bar__text:active {
  background-color: none;
}

.id-from {
  .van-field__control {
    color: #5788ff;
  }

  .van-cell {
    padding: 20px 32px;
  }

  .van-cell::after {
    display: none;
  }
}

.id-from.border {
  .van-cell {
    border: 1px solid #ebedf0;
    margin: 20px 0;
    padding: 25px 32px;
    border-radius: 10px;
  }
}

.authentication {
  border-radius: 15px;

  .box {
    width: 550px;
    background-color: #fff;
    padding: 0 30px 72px;
    text-align: center;

    .icon-authentication {
      width: 200px;
      height: 200px;
      display: inline-block;
      margin: 63px 0 30px;
      background-image: url('/static/images/icon-authentication.png');
      background-repeat: no-repeat;
      background-size: contain;
    }

    .text {
      font-size: 34px;
      color: #353535;
      line-height: 60px;
      text-align: center;
    }

    .btn {
      width: 300px;
      height: 88px;
      background: rgba(109, 119, 255, 1);
      border-radius: 44px;
      margin: 60px auto 0;
      line-height: 88px;
      text-align: center;
      color: #fff;
      font-size: 34px;
    }
  }
}

// ImagePreview
@image-preview-index-text-color: @white;
@image-preview-index-font-size: 32px;
@image-preview-index-text-shadow: 0 1px 1px @gray-8;
@image-preview-overlay-background-color: rgba(0, 0, 0, 0.9);
@image-preview-close-icon-size: 40px;
@image-preview-close-icon-color: @gray-5;
@image-preview-close-icon-active-color: @gray-6;
@image-preview-close-icon-margin: @padding-md;
@image-preview-close-icon-z-index: 1;

// Uploader
@uploader-size: 160px;
@uploader-icon-size: 44px;
@uploader-icon-color: @gray-4;
@uploader-text-color: @gray-6;
@uploader-text-font-size: @font-size-sm;
@uploader-upload-border-radius: 16px;
@uploader-upload-background-color: @gray-1;
@uploader-upload-active-color: @active-color;
@uploader-delete-color: @gray-6;
@uploader-delete-icon-size: 36px;
@uploader-delete-background-color: @white;
@uploader-file-background-color: @background-color;
@uploader-file-icon-size: 40px;
@uploader-file-icon-color: @gray-7;
@uploader-file-name-padding: 0 @padding-base;
@uploader-file-name-margin-top: @padding-xs;
@uploader-file-name-font-size: 40px;
@uploader-file-name-text-color: @gray-7;
@uploader-mask-background-color: fade(@gray-8, 88%);
@uploader-mask-icon-size: 44px;
@uploader-mask-message-font-size: @font-size-sm;
@uploader-mask-message-line-height: 28px;
@uploader-loading-icon-size: 44px;
@uploader-loading-icon-color: @white;
@uploader-disabled-opacity: @disabled-opacity;

// ActionSheet
@action-sheet-max-height: 80%;
@action-sheet-header-height: 88px;
@action-sheet-header-font-size: @font-size-lg;
@action-sheet-description-color: @gray-7;
@action-sheet-description-font-size: @font-size-md;
@action-sheet-description-line-height: 40px;
@action-sheet-item-height: 100px;
@action-sheet-item-background: @white;
@action-sheet-item-font-size: @font-size-lg;
@action-sheet-item-text-color: @text-color;
@action-sheet-item-disabled-text-color: @gray-5;
@action-sheet-subname-color: @gray-7;
@action-sheet-subname-font-size: @font-size-sm;
@action-sheet-close-icon-size: 44px;
@action-sheet-close-icon-color: @gray-5;
@action-sheet-close-icon-active-color: @gray-6;
@action-sheet-close-icon-padding: 0 @padding-md;
@action-sheet-cancel-padding-top: @padding-xs;
@action-sheet-cancel-padding-color: @background-color;

.xgplayer-skin-default .xgplayer-start {
  width: 140px !important;
  height: 140px !important;
}

.xgplayer-skin-default .xgplayer-start div svg {
  width: 140px !important;
  height: 140px !important;
  margin: 28px !important;
}

.goodsAlert {
  color: #353535;
  font-size: 34px;
  line-height: 55px;

  .time {
    color: red;
  }
}

// .van-pull-refresh,
// .van-pull-refresh .van-pull-refresh__track {
//   height: 100%;
//   overflow: auto;
// }


// 更新提示弹窗
.CheckUpdate {
  width: 560px;
  border-radius: 4px;

  .percent-flex {
    height: .9rem;
    display: flex;
    padding: 0 20px;
    align-items: center;

    .name {
      position: absolute;
      font-size: 26px;
      top: 10px;
      right: 0;
      left: 0;
      text-align: center;
    }

    .percent {
      background-color: #eee;
      height: 14px;
      width: 100%;
      margin-top: 40px;
      position: relative;

      .progress {
        background-color: #4873be;
        height: 14px;
        position: relative;
      }
    }
  }

  .title {
    font-size: 32px;
    background-color: #eee;
    padding: 18px 30px 16px;
  }

  .content {
    padding: 24px 30px 0;
    font-size: 28px;
    line-height: 46px;

    .p-content {
      padding: 18px 0;
    }

    .time {
      color: #666;
      font-size: 24px;
    }
  }

  .button {
    text-align: right;
    padding: 28px;
    margin: 0;
    line-height: 46px;

    .btn {
      margin-left: 28px;
      margin-top: 0;
      font-size: 24px;
      padding: 9px 22px;
      border-radius: .04rem;
      display: inline-block;
      border: .02rem solid #eee;
    }

    .cancel {
      padding: 10px 30px;
    }

    .btn.gradient {
      border-color: transparent;
      color: #fff;
      background-image: linear-gradient(90deg, #3a83ff 0%, #4873be 100%);
    }
  }
}

.m-price {
  display: inline-flex;
  align-items: center;
  vertical-align: bottom;
  font-family: -apple-system, Helvetica, sans-serif;

  &::before {
    content: '￥';
    display: block;
    font-size: 22px;
  }
}

.g-popup-coupon {
  background-color: #F5F5F4;
  padding: 10px 30px 25px;
}

.van-rate {
  .van-rate__item {
    margin: 0 6px;
  }
}

.van-icon-rate-yellow,
.van-icon-rate-gray,
.van-icon-rate-red {
  width: 32px;
  height: 30px;
  display: block;
  background-repeat: no-repeat;
  background-size: cover;
}

.van-icon-rate-gray {
  background-image: url('/static/img/icon-rate-gray.png');
}

.van-icon-rate-red {
  background-image: url('/static/img/icon-rate-red.png');
}

.van-icon-rate-yellow {
  background-image: url('/static/img/icon-rate-yellow.png');
}

.van-button::before {
  display: none;
}

.product-box {
  background-color: #fff;
  padding: 30px 20px 20px;
  margin: 0 20px 22px;
  border-radius: 15px;

  .inventory {
    display: flex;
    margin-top: 40px;
    justify-content: space-between;

    .item-title {
      font-size: 28px;
      line-height: 62px;
    }
  }

  .stroe {
    display: flex;
    padding-bottom: 20px;

    .name {
      margin-left: 20px;
      font-size: 32px;
      display: flex;
      align-items: center;

      &::after {
        content: '';
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-left: 7px;
        background-image: url('/static/img/icon-arrow_right.png');
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
      }
    }
  }

  .comments-stroe {
    padding-bottom: 10px;

    .name {
      font-size: 30px;
      display: flex;
      align-items: center;

      &::before {
        content: '';
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-top: -2px;
        margin-right: 5px;
        background-image: url('/static/img/icon-action-store-active.png');
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
      }
    }
  }

  .comments-btn {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 10px;

    .btn {
      height: 60px;
      padding: 0 40px;
      line-height: 58px;
      display: inline-block;
      font-size: 28px;
      border-radius: 60px;
      border: 1px solid #FF0034;
      text-align: center;
      color: #FF0034;
    }
  }

  .product-info {
    display: flex;
    background-color: #fff;
    border-radius: 15px;
    padding: 18px 0 18px;

    .van-checkbox {
      width: 60px;
      margin-top: -20px;
    }

    .imgPath {

      // width: 180px;
      // height: 180px;
      .van-image__img {
        border-radius: 10px;
      }
    }

    .comments {
      flex: 1;
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap;
      margin-left: 20px;

      .name {
        font-size: 28px;
        align-items: center;
        color: #353535;
        line-height: 40px;
        flex: 1;
      }

      .slot {
        padding: 0 20px;
        text-align: right;
        width: 140px;

        .m-price {
          font-size: 32px;
          color: #FF0034;

          &::before {
            font-size: 20px;
          }
        }

        .num {
          color: #959595;
          font-size: 24px;
        }
      }

      .goods-score {
        display: flex;
        align-items: center;
        margin-top: 10px;

        .goods-score-name {
          font-size: 28px;
          color: #353535;
          padding-right: 16px;
        }
      }
    }

    .column {
      flex-direction: column;
    }

    .detail {
      margin-left: 30px;
      // height: 180px;
      overflow: hidden;
      flex: 1;
      display: flex;
      flex-direction: column;

      .info {
        display: flex;

        .m-price {
          font-size: 32px;
          color: #FF0034;
          margin-left: 50px;
        }
      }

      .name {
        font-size: 28px;
        color: #353535;
        line-height: 40px;
      }

      .spec {
        font-size: 24px;
        color: #999;
        line-height: 30px;
        overflow: hidden;
        padding: 10px 0 0;
        margin-bottom: 15px;
        flex: 1;
      }

      .price-num,
      .flex-end {
        display: flex;
        justify-content: space-between;
        align-items: center;

        .stepper {
          margin-top: -2px;
        }

        .funs {
          color: #999;
          font-size: 24px;
        }

        .collection-btn {
          height: 55px;
          padding: 0 20px;
          line-height: 55px;
          font-size: 28px;
          border-radius: 55px;
          border: 1px solid #FF0034;
          /*no*/
          text-align: center;
          color: #FF0034;
        }

        .collection-btn.active {
          color: #353535;
          border: 1px solid #999;
          /*no*/
        }

        .m-price {
          color: #ff0034;
          font-size: 34px;
          font-weight: 800;

          .text {
            color: #ff0034;
            font-size: 24px;
            vertical-align: middle;
          }
        }

        .num {
          font-size: 24px;
          color: #999;
          line-height: 30px;
        }
      }

      .flex-end {
        margin-top: 20px;
      }
    }
  }

  .remark {
    margin-top: 36px;
    border-top: 2px solid #eeeeee;

    /deep/ .van-cell {
      padding: 25px 0;
    }
  }
}

.van-image__error-icon {
  font-size: 62px;
}

.van-uploader__upload-icon {
  font-size: 60px;
  color: #ff0034;
}

[class*='van-hairline-j']::after {
  position: absolute;
  box-sizing: border-box;
  content: ' ';
  pointer-events: none;
  top: -50%;
  right: -50%;
  bottom: -50%;
  left: -50%;
  border: 0 solid #ebedf0;
  transform: scale(0.5);
}

.van-hairline-j,
.van-hairline-j--top,
.van-hairline-j--left,
.van-hairline-j--right,
.van-hairline-j--bottom,
.van-hairline-j--surround,
.van-hairline-j--top-bottom {
  position: relative;
}

.van-hairline-j--top::after {
  border-top-width: 1px;
  /*no*/
}

.van-hairline-j--left::after {
  border-left-width: 1px;
  /*no*/
}

.van-hairline-j--right::after {
  border-right-width: 1px;
  /*no*/
}

.van-hairline-j--bottom::after {
  border-bottom-width: 1px;
  /*no*/
}

.van-hairline-j--top-bottom::after,
.van-hairline-j-unset--top-bottom::after {
  border-width: 1px 0;
  /*no*/
}

.van-hairline-j--surround::after {
  border-width: 1px;
  /*no*/
}

.van-checkbox__icon .van-icon {
  border: 1px solid #c8c9cc;
  /*no*/
}